<template>
  <view>
    <!-- 1定位打卡 -->
    <!--  :class="workState==2?'chidao':workState==3?'wifi':''" -->
    <view class="clock-in-box">
      <!-- 打卡成功 -->
      <view v-if="workState==4">
        <img src="/static/images/boss/icon_b_dk.png" alt="">
      </view>
      <!-- 待打卡 -->
      <view v-if="workState==1" @tap="handleClockIn()">
        <!-- <img src="/static/images/boss/icon_b_face.png" alt=""> -->
        <!--  :style="cardState==3?'margin:0':'margin:29px auto 2px'" -->
        <view class="c-i-b-t" style="margin:29px auto 2px">{{ sbxb }}</view>
        <view class="c-i-b-b">22</view>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  data(){
    return {
    }
  },
  props:{
    workState:{
      type:Number,
      default:0,
    },
    inviteInfo:{
      type:Object,
      default:{}
    }
  },
  watch: {
		inviteInfo: {
			handler(newVal,oldVal) {
				if (newVal) {
				}
			},
			immediate: true
		}
	},
  computed:{
    sbxb() {
      let nowDate=this.$moment().format('YYYY-MM-DD')
      let beginTime=`${nowDate} ${this.inviteInfo.beginTime}:00`
      let nowTime=this.$moment().format('YYYY-MM-DD HH:mm:ss')
      // if(new Date(nowTime).getTime()>new Date(nowTime).getTime()){}
      return 11
    }
  }
}
</script>
<style lang="scss" scoped>
.clock-in-box{
  width: 120px;
  height: 120px;
  margin: 0 auto 20px;
  border-radius: 50%;
  border: 2px solid #1C7AF7;
  &>view{
    margin: 7px auto 0;
    border-radius: 50%;
    width: 106px;
    height: 106px;
    border-top: 1px solid transparent;
    background: linear-gradient( 180deg, #02B4F2 0%, #1C7AF7 100%);
    text-align: center;
    img{
      width: 20px;
      height: 20px;
      margin: 14px auto 2px;
    }
    img.dkcg{
      width: 39px;
      height: 46px;
      margin: 30px auto;
    }
    .c-i-b-t{
      font-weight: 500;
      font-size: 18px;
      color: #FFFFFF;
      line-height: 26px;
    }
    .c-i-b-b{
      font-weight: 500;
      font-size: 15px;
      color: rgba(255,255,255,0.5);
      line-height: 22px;
    }
  }
}
</style>